import echarts from 'echarts';

$.annularChart = function annularChart(elem, data) {
    let chart = echarts.init(elem);
    chart.setOption({
        title: {
            text: data.title,
            subtext: data.subtext,
            textStyle: {
                fontSize: '15',
                fontWeight: 'bold'
            },
            subtextStyle: {
                fontSize: '10'
            }
        },
        tooltip: {
            trigger: 'item',
            formatter: "{a} <br/>{b}: {d}%",
            // formatter: "{a} <br/>{b}: {c} ({d}%)"
        },
        series: [{
            name: data.title,
            type: 'pie',
            radius: ['50%', '70%'],
            avoidLabelOverlap: false,
            label: {
                normal: {
                    show: false,
                },
                emphasis: {
                    show: true,
                    textStyle: {
                        fontSize: '15',
                        fontWeight: 'bold'
                    }
                }
            },
            labelLine: {
                normal: {
                    show: false
                }
            },
            data: data.data
        }]
    });
    return chart
}

$.lineChart = function lineChart(elem, data) {
    let chart = echarts.init(elem);
    chart.setOption({
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            data: data.legendData
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: data.xAxisData
        },
        yAxis: {
            type: 'value'
        },
        series: data.series
    });
}

$.reloadChart = function reloadChart(chart, data) {
    chart.setOption({
        series: [{
            data: data
        }]
    });
}
